// =============================================================================
// Respond-to mixin
//
// Table of contents:
// 1. Get breakpoint info
// 2. respond-to(ie)
// 3. respond-to(retina)
// 4. respond-to($breakpoint)
//  4.1. Old-IE support
//  4.2. Breakpoints and groups
// 5. respond-to min and max mixins
//
// =============================================================================

@mixin respond-to($breakpoint) {

	// =============================================================================
	// 1. Get breakpoint info
	// =============================================================================

	$breakpoint-info: getBreakpointInfo($breakpoint);

	// Breakpoint info error
	@if $breakpoint-info == 'error' {
		@warn '[ERROR] Invalid breakpoint parameter';

	// =============================================================================
	// 2. respond-to(ie)
	// =============================================================================

	// Respond to IE
	} @else if $breakpoint-info == 'ie' {
		// Only print content if support is true
		@if $old-ie-support == true {
			@content;
		}

	// =============================================================================
	// 3. respond-to(retina)
	// =============================================================================

	// Respond to retina displays
	} @else if $breakpoint-info == 'retina' {
		@if $old-ie-support != true { // should not compile on Old-IE stylesheets
			@include respond-to-retina { @content; }
		}

	// =============================================================================
	// 4. respond-to($breakpoint)
	// =============================================================================

	} @else {

		$breakpoint-name: nth($breakpoint-info, 1);
		$breakpoint-extend: nth($breakpoint-info, 2);
		$breakpoint-group: nth($breakpoint-info, 3);
		$breakpoint-group-id: nth($breakpoint-info, 4);

		$min-width: 0;
		$max-width: 0;

		// =============================================================================
		// 4.1. Old IE support
		// =============================================================================

		@if $old-ie-support == true {

			@if yepnope($breakpoint-names, $old-ie-breakpoint) {

				// Get the value of the old-ie breakpoint
				$old-ie-breakpoint-value: nth($breakpoint-values, index($breakpoint-names, $old-ie-breakpoint));

				// Don't know why this prevents throwing an error :S
				$breakpoint-value: null;

				@if $breakpoint-group == true {
					// Get the group min-width
					$breakpoint-value: nth( nth($breakpoint-groups, $breakpoint-group-id), 2);
				} @else {
					// Get the breakpoint value
					$breakpoint-value: nth($breakpoint-values, index($breakpoint-names, $breakpoint-name));
				}

				// Check if the media query should respond
				@if $breakpoint-extend == 'only' and $breakpoint-value == $old-ie-breakpoint-value {
					@content;
				} @else if $breakpoint-extend == 'and-up' and $old-ie-breakpoint-value >= $breakpoint-value {
					@content;
				} @else if $breakpoint-extend == 'and-below' and $old-ie-breakpoint-value <= $breakpoint-value {
					@content;
				}
			} @else {
				// Invalid $old-ie-breakpoint value
				@warn "[ERROR] "+ $old-ie-breakpoint +" is not a valid breakpoint name for $old-ie-breakpoint. Valid breakpoint names are: "+ $breakpoint-names
			}

		// =============================================================================
		// 4.2. Breakpoints and groups
		// =============================================================================

		} @else {
			$breakpoint-name: nth($breakpoint-info, 1);
			$breakpoint-extend: nth($breakpoint-info, 2);
			$breakpoint-group: nth($breakpoint-info, 3);
			$breakpoint-group-id: nth($breakpoint-info, 4);

			$min-width: 0;
			$max-width: 0;

			@if $old-ie-support == true {
				@if $breakpoint-name == $old-ie-breakpoint or $breakpoint-name == $old-ie-breakpoint {
					@content;
				}
			} @else {

				// If it's a regular breakpoint
				@if $breakpoint-group == false {
					$min-width: nth($breakpoint-values, index($breakpoint-names, $breakpoint-name));

					// Only set a max-width if it's not the last breakpoint
					@if (index($breakpoint-names, $breakpoint-name) + 1) <= length($breakpoint-values) {
						$max-width: nth($breakpoint-values, (index($breakpoint-names, $breakpoint-name) + 1));
					} @else {
						@if $breakpoint-extend == and-below {
							$max-width: nth($breakpoint-values, (index($breakpoint-names, $breakpoint-name)));
						} @else {
							$breakpoint-extend: and-up;
						}
					}

				// If it's a breakpoint group
				} @else {
					$min-width: nth( nth($breakpoint-groups, $breakpoint-group-id), 2);
					$max-width: nth( nth($breakpoint-groups, $breakpoint-group-id), 3);
				}

				@if $breakpoint-extend == only {
					@include respond-to-min-and-max-width($min-width, $max-width){ @content };
				} @else if $breakpoint-extend == and-up {
					@include respond-to-min-width($min-width){ @content };
				} @else if $breakpoint-extend == and-below {
					@include respond-to-max-width($max-width){ @content };
				}
			}
		}
	}
}

// =============================================================================
// 5. respond-to min and max mixins
// =============================================================================

@mixin respond-to-min-and-max-width($min-width, $max-width) {
	@media only #{$responder-media-type}
	 and (min-width: getSize($min-width))
	 and (max-width: getSize($max-width - 1)) {
		@content;
	}
}

@mixin respond-to-min-width($min-width) {
	@media only #{$responder-media-type}
	 and (min-width: getSize($min-width)) {
		@content;
	}
}

@mixin respond-to-max-width($max-width) {
	@media only #{$responder-media-type}
	 and (max-width: getSize($max-width - 1)) {
		@content;
	}
}